<mat-card class="tabCard">
  <mat-card-title>
    <h5>Service Access Strategy</h5>
  </mat-card-title>
  <div class="cardContent">
    <div>
      <mat-checkbox [(ngModel)]="data.service.accessStrategy.ssoEnabled">
        <ng-container i18n="services.form.label.sas.ssoEnabled">
          {{ messages.services_form_label_sas_ssoEnabled }}
        </ng-container>
      </mat-checkbox>
      <mat-icon style="font-size: medium"
               i18n-matTooltip="services.form.tooltip.sas.ssoEnabled"
               [matTooltip]="messages.services_form_tooltip_sas_ssoEnabled">help
      </mat-icon>
      <mat-checkbox [(ngModel)]="data.service.accessStrategy.requireAllAttributes">
        <ng-container i18n="services.form.label.sas.requireAll">
          {{ messages.services_form_label_sas_requireAll }}
        </ng-container>
      </mat-checkbox>
      <mat-icon style="font-size: medium"
               i18n-matTooltip="services.form.tooltip.sas.requireAll"
               [matTooltip]="messages.services_form_tooltip_sas_requireAll">help
      </mat-icon>
    </div>

    <div>
      <mat-form-field class="textInput">
        <input matInput
               i18n-placeholder="services.form.label.sas.unauthorizedredirecturl"
               [placeholder]="messages.services_form_label_sas_unauthorizedredirecturl"
               [(ngModel)]="data.service.accessStrategy.unauthorizedRedirectUrl">
      </mat-form-field>
      <mat-icon style="font-size: medium"
               i18n-matTooltip="services.form.tooltip.sas.unauthorizedredirecturl"
               [matTooltip]="messages.services_form_tooltip_sas_unauthorizedredirecturl">help
      </mat-icon>
    </div>
  </div>
</mat-card>
<mat-card class="tabCard">
  <mat-card-title>
    <h5>Required Attributes</h5>
  </mat-card-title>
  <div class="cardContent">
    <app-rejectedattributes [attributes]="data.service.accessStrategy.requiredAttributes"></app-rejectedattributes>
    <div>
      <mat-checkbox [(ngModel)]="data.service.accessStrategy.caseInsensitive">
        <ng-container i18n="services.form.label.sas.caseinsensitive">
          {{ messages.services_form_label_sas_caseinsensitive }}
        </ng-container>
      </mat-checkbox>
      <mat-icon style="font-size: medium"
                i18n-matTooltip="services.form.tooltip.sas.unauthorizedredirecturl"
                [matTooltip]="messages.services_form_tooltip_sas_unauthorizedredirecturl">help
      </mat-icon>
    </div>
  </div>
</mat-card>

  <mat-card class="tabCard">
    <mat-card-title>
      <h5>Type</h5>
    </mat-card-title>
    <div class="cardContent">
      <div>
        <mat-form-field class="textInput">
          <mat-select i18n-placeHolder="services.form.label.sas.selecttype"
                      [placeholder]="messages.services_form_label_sas_selecttype"
                     [(ngModel)]="type" (change)="changeType()">
            <mat-option *ngFor="let opt of types" [value]="opt">{{ TYPE[opt] }}</mat-option>
          </mat-select>
        </mat-form-field>
        <mat-icon style="font-size: medium"
                 i18n-matTooltip="services.form.tooltip.sas.selecttype"
                 [matTooltip]="messages.services_form_tooltip_sas_selecttype">help
        </mat-icon>

      </div>

      <div *ngIf="type == TYPE.REMOTE">
        <app-remote></app-remote>
      </div>

      <div *ngIf="type == TYPE.TIME || type == TYPE.GROUPER">
        <app-time></app-time>
      </div>

      <div *ngIf="type == TYPE.GROUPER">
        <app-grouper></app-grouper>
      </div>

      <div *ngIf="type == TYPE.SURROGATE">
        <app-surrogate></app-surrogate>
      </div>

    </div>
  </mat-card>

  <mat-card class="tabCard">
    <mat-card-title>
      <h5>Rejected Attributes</h5>
    </mat-card-title>
    <div class="cardContent">
    <app-rejectedattributes [attributes]="data.service.accessStrategy.rejectedAttributes"></app-rejectedattributes>
    </div>
  </mat-card>




